<!DOCTYPE html>
<html>
    <head>
        <title>1</title>
        <script type="text/javascript" src="../js/vue.js"></script>
    </head>
    <body>
        <!-- 
        我们学过的指令：
            v-bind→：·单向绑定解析表达式，·可简写为·：xxx
            V-mode1→：·双向数据绑定
            v-for··→：·遍历数组/对象/字符串
            v-on·>：·绑定事件监听，·可简写为@
            v-if。→·→：·条件染（动态控制节点是否存存在）
            V-else·：条件渲染（动态控制节点是否存存在）
            V-show：条件渲染（动态控制节点是否展示）
 -->
       <div id="root">
            <h1></h1>
            <div>{{name}}</div>
            <div v-text="name">11111</div>
        </div>
        <script type="text/javascript">
            Vue.config.productionTip = false
            new Vue({
                el: '#root', 
                data(){
                    return {
                        name:'aaaaaaaa'
                    }
                }
            })
        </script>
    </body>
</html>
